<template>
        <view class="uni-body">
          <view class="terminalName">终端名称：{{dailyYwData.terminalName}}</view>
		  <view class="" :style="{ height: 'calc(100vh - 400rpx)' }">
		  	<scroll-view scroll-y="true" class="scroll-Y" >
		  	         <view class="title"><view class="line-left"></view>农污设施</view>
		  			  	<view class="nwssBox" v-for="(i,index) in dailyYwData.statusDtoList" :key="index">
							<view style="display: flex;">
								<view style="width: 52%">{{i.name}}</view>
								<view><image class="icon" src="../../static/icon/true.png" mode=""></image>
								{{i.isIssue==1?'无问题':i.isIssue==2?'有问题':''}}
								</view>
								<view v-if='i.isHandle==1' class="wcl">未处理</view>
								<view v-if='i.isHandle==2' class="ycl">已处理</view>
							</view>
						<view class="flexItem" style="margin-top: 10rpx;" v-if="i.problemDetail"><text>问题描述</text><view class="text">{{i.problemDetail}}</view></view>
						<view class="flexItem" v-if="i.handleDetail"><text>处理措施</text><view class="text">{{i.handleDetail}}</view></view>
		  				</view>
		  			<view class="title"><view class="line-left"></view>监测设备</view>
		  					  	<view class="nwssBox" v-for="(i,index) in dailyYwData.equDtoList" :key="index">
									<view style="display: flex;">
		  					  	<view style="width: 52%;">{{i.name}}</view>
		  						<view><image class="icon" src="../../static/icon/true.png" mode=""></image>
		  						{{i.isIssue==1?'无问题':i.isIssue==2?'有问题':''}}
		  						</view>
		  						<view v-if='i.isHandle==1' class="wcl">未处理</view>
		  						<view v-if='i.isHandle==2' class="ycl">已处理</view>
		  						</view>
		  			        <view class="flexItem" style="margin-top: 10rpx;" v-if="i.problemDetail"><text>问题描述</text><view class="text">{{i.problemDetail}}</view></view>
		  			        <view class="flexItem" v-if="i.handleDetail"><text>处理措施</text><view class="text">{{i.handleDetail}}</view></view>
		  			        </view>
		  	       <view class="title"><view class="line-left"></view>问题图片</view>
		  			      <view class="flexItem" style="border-bottom: 0;display: flex;">
		  					<view v-if="dailyYwData.pic" style="display: flex;flex-wrap: wrap;">
		  					  <image style="width: 150rpx; height: 150rpx;margin-right: 10rpx;" v-for="(pic, index) in dailyYwData.pic.split(',')"
		  					    :src="pic" :key="index" mode="aspectFit" @click="clickImg(pic, index)">
		  					  </image>
		  					</view>
		  					</view>
		  					<view class="title"><view class="line-left"></view>处理图片</view>
		  					      <view class="flexItem" style="border-bottom: 0;display: flex;">
		  							<view v-if="dailyYwData.handlePic" style="display: flex;flex-wrap: wrap;">
		  							  <image style="width: 150rpx; height: 150rpx;margin-right: 10rpx;" v-for="(pic, index) in dailyYwData.handlePic.split(',')"
		  							    :src="pic" :key="index" mode="aspectFit" @click="clickImg(pic, index)">
		  							  </image>
		  							</view>
		  							</view>
		  							<view class="title"><view class="line-left"></view>工作内容</view>
		  							<view class="workDetail">{{dailyYwData.workDetail||'无'}}</view>
		  			 <view class="title"><view class="line-left"></view>水体检查</view>
		  			 <view class="flexItem">水体检查<view class="text">{{dailyYwData.water||'无'}}</view></view>
		  	        <view class="flexItem">有无问题<view class="text">{{dailyYwData.waterIssue==1?'无问题':dailyYwData.waterIssue==2?'有问题':''}}</view></view>
		  			 <view class="flexItem" v-if="dailyYwData.waterDesc"><text>问题描述</text><view class="text">{{dailyYwData.waterDesc}}</view></view>
		  			  <view class="flexItem" v-if="dailyYwData.waterHandle">处理状态
		  			  <view v-if='dailyYwData.waterHandle==1' class="wcl" style="margin-left: 24rpx;">未处理</view>
		  			  <view v-if='dailyYwData.waterHandle==2' class="ycl" style="margin-left: 24rpx;">已处理</view>
		  			  </view>
		  			  <view class="flexItem" v-if="dailyYwData.waterMeasure"><text>处理措施</text><view class="text">{{ dailyYwData.waterMeasure}}</view></view>
		  	        <view class="flexItem">运维时间<view class="text"><view>{{dailyYwData.checkTime}}</view><view>{{dailyYwData.omTime}}</view></view></view>
		  	        <view class="flexItem" style="border-bottom: 0;padding-bottom: 0">提交人员<view class="text">{{ dailyYwData.submitter }}</view></view>
		  	     </scroll-view>
		  </view>
		  
	  </view>
</template>
<script>

export default {
  props: {
  	dailyYwData: {
  		type: Object,
  		required: true
  	}
  },
  data() {
    return {
		
     
    };
  },
  created() {
	
  },
  mounted() {},
  methods: {
   // 图片预览功能
      clickImg(url, index) {
        var imageArr = [];
        imageArr.push(url);
        //uniapp预览轮播图方法
        uni.previewImage({
          current: index, //预览图片的下标
          urls: imageArr //预览图片的地址，必须要数组形式
        })
      },
  },
};
</script>
<style scoped lang="scss">
    .uni-body{
         margin: 0 32rpx;
         padding:28rpx;
         background: #FFFFFF;
         font-weight: 800;
         font-size: 28rpx;
         color: #4A4A4A;
         border-radius: 10rpx 10rpx 10rpx 10rpx;
          .flexItem{
            display: flex;
			border-bottom: 1rpx #EBEBEB solid;
            margin-bottom:15rpx;
			padding-bottom: 15rpx;
			color: #989898;
			// padding-left: 20rpx;
            .text{
			  margin-left: 25rpx;
			  color: #4A4A4A;
            }
			text{
				white-space: nowrap;
			}
          }
		  .workDetail{
		    width: 584rpx;
		    min-height: 192rpx;
		    border-radius: 10rpx 10rpx 10rpx 10rpx;
		    border: 1rpx solid #EFEFEF;
		    color: #4A4A4A;
			padding: 20rpx;
			margin-bottom: 20rpx;
		  }
		  .nwssBox{
			  font-weight: bold;
			  color: #4A4A4A;
			  margin-left: 22rpx;
			  margin-bottom: 20rpx;
			  .icon{
				  width: 32rpx;
				  height: 32rpx;
				  vertical-align: middle;
				  margin-right: 8rpx;
			  }
		  }
		  .ycl{
		  				  width: 114rpx;
		  				  height: 44rpx;
		  				  line-height: 44rpx;
		  				  text-align: center;
		  				  background: #D5EFE7;
		  				  border-radius: 6rpx 6rpx 6rpx 6rpx;
		  				  font-weight: bold;
		  				  font-size: 28rpx;
		  				  color: #74CDAF;
		  				  margin-left: 36rpx;
		  }
		  .wcl{
		  				  width: 114rpx;
		  				  height: 44rpx;
		  				  background: rgba(252,131,130,0.4);
		  				  border-radius: 6rpx 6rpx 6rpx 6rpx;
		  				  line-height: 44rpx;
		  				  text-align: center;
		  				  font-weight: bold;
		  				  font-size: 28rpx;
		  				  color: #FC8382;
		  				  margin-left: 36rpx;
		  }
          .margin{
           width: 450rpx;
           height: 150rpx;
           border-radius: 10rpx 10rpx 10rpx 10rpx;
           border: 1rpx solid #EFEFEF;
		   padding-left: 32rpx;
		   padding-top: 8rpx;
		   margin-left: 10rpx;
		   color: #4A4A4A;
          }
          .terminalName{
            border-bottom: 1rpx #EBEBEB solid;
            margin-bottom:18rpx;
			padding-bottom: 22rpx;
          }
        .title{
		  display: flex;
		  align-items: center;
          border-bottom: 1rpx #EBEBEB solid;
          margin-bottom:18rpx;
          padding-bottom: 20rpx;
		  .line-left{
		  			 width: 8rpx;
		  			 height: 20rpx;
		  			 background: #2769F7;
		  			 border-radius: 6rpx 6rpx 6rpx 6rpx;
		  			 opacity: 0.6;
		  			 margin-right: 12rpx;
		  }
        }
		.scroll-Y {
			height: 100%;
		}
      }
</style>
